<template>
	<div>
		<el-dialog title="选择图标" v-model="isShow" width="36%" destroy-on-close
			:close-on-press-escape="false" :close-on-click-modal="false">
			<div style="overflow-y: auto;height: 500px;">
				<div style="display: flex;flex-wrap:wrap">
					
					<div v-for="(item,index) in curList" @click="selectChange(item,index)"
						style="padding: 10px;border: #ededed 1px solid;">
						<el-icon style="font-size: 40px;">
							<component :is="item"></component>
						</el-icon>
					</div>
				</div>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import {
		icons
	} from '@element-plus/icons-vue/global'

	export default {
		name: "gz-elicon",
		created() {},
		data() {
			return {
				isShow: false,
				curList: []
			};
		},
		props: {},
		methods: {
			open() {
				this.curList= icons
				this.isShow = true
			},
			selectChange(item, index) {
				this.isShow = false
				this.$emit("selectchange", item)
			}
		},
	};
</script>

<style>
</style>